<template>
	<div>
		<el-drawer title="" :visible.sync="drawer" :direction="direction" :before-close="handleClose" custom-class="drawer-info">
			<div class="info-item">
				<h5 class="from-title">基本信息</h5>
				<div class="form-item">
					<label class="form-item-label">申请人:</label>
					<div class="form-item-content">{{ objInfo._castle_apply_user_name }}</div>
				</div>
				<div class="form-item">
					<label class="form-item-label">申请时间:</label>
					<div class="form-item-content">{{ objInfo._castle_apply_date }}</div>
				</div>
				<div class="form-item">
					<label class="form-item-label">申请状态:</label>
					<div class="form-item-content">{{ objInfo._castle_approve_status }}</div>
				</div>
				<h5 class="from-title">申请信息</h5>
				<div class="form-item" v-for="(item, index) in objInfo.bizDatas" :key="item.colId">
					<label class="form-item-label">{{ item.colName }}:</label>
					<div class="form-item-content">{{ formatContent(item) }}</div>
				</div>

				<div class="form-item" v-if="objInfo._castle_leave_type">
					<label class="form-item-label">请假类型:</label>
					<div class="form-item-content">{{ objInfo.typeIdName }}</div>
				</div>
				<div class="form-item" v-if="objInfo._castle_start_time">
					<label class="form-item-label">请假开始时间:</label>
					<div class="form-item-content">{{ objInfo._castle_start_time }}</div>
				</div>
				<div class="form-item" v-if="objInfo._castle_end_time">
					<label class="form-item-label">请假结束时间:</label>
					<div class="form-item-content">{{ objInfo._castle_end_time }}</div>
				</div>

				<h5 class="from-title">审批信息</h5>
				<div class="form-item">
					<div class="form-item-content">
						<self-appoint
							ref="SelfAppoint"
							v-model="params"
							:fid="flowId"
							:pid="processId"
							:engineVersion="engineVersion"
							readonly
							request
						></self-appoint>
					</div>
				</div>
			</div>
		</el-drawer>
	</div>
</template>
<script>
import { infoAnalyzeFlowableApp } from "@/api/flowable/flowableapp.js"
import { enumList, urlList } from "@/api/public.api.js"
import request from "@/common/request"

export default {
	data() {
		return {
			drawer: true,
			direction: "rtl",
			params: {},
			objInfo: {},
			YesNoList: [],
			flowIdList: [],
			flowId: "",
			processId: "",
			engineVersion: "",
			typeIdList: [],
		}
	},
	created() {},
	methods: {
		queryEnumList() {
			this.YesNoList = []
			enumList("YesNo", "").then(resp => {
				if (resp.code == 0) {
					this.YesNoList = resp.data
				}
			})
		},
		queryUrlList() {
			this.flowIdList = []
			urlList("/flowable/flowableTemplate/list").then(resp => {
				if (resp.code == 0) {
					if (resp.data) {
						resp.data.forEach(item => {
							this.flowIdList.push({ code: item.id, name: item.title })
						})
					}
				}
			})
			this.typeIdList = []
			urlList("/oa/holidayType/list").then(resp => {
				if (resp.code == 0) {
					if (resp.data) {
						resp.data.forEach(item => {
							this.typeIdList.push({ code: item.id, name: item.name })
						})
					}
				}
			})
		},
		init(flowId, processId, id, engineVersion) {
			this.flowId = flowId
			this.processId = processId
			this.engineVersion = engineVersion
			this.$nextTick(() => {
				this.$refs.SelfAppoint.getData()
			})
			this.queryEnumList()
			this.queryUrlList()
			if (id) {
				infoAnalyzeFlowableApp({ flowId: flowId, id: id }).then(res => {
					this.objInfo = res.data
					let flowIdObj = this.flowIdList.find(item => {
						return item.code == this.objInfo.flowId
					})
					this.objInfo.flowIdName = flowIdObj ? flowIdObj.name : ""

					if (this.objInfo._castle_leave_type) {
						console.log(this.typeIdList)
						console.log("有type")
						let typeIdObj = this.typeIdList.find(item => {
							return item.code == this.objInfo._castle_leave_type
						})
						console.log("typeIdObj", typeIdObj)
						this.objInfo.typeIdName = typeIdObj ? typeIdObj.name : ""
					}
				})
			}
			this.drawer = true
		},
		// 关闭抽屉
		handleClose(done) {
			done()
		},
		formatContent(item) {
			if (item.colId === "fortress_holiday") {
				try {
					const value = JSON.parse(item.colValue)

					return `${value.startTime}${value.startType === "am" ? "上午" : "下午"} 至 ${value.endTime}${
						value.endType === "am" ? "上午" : "下午"
					}\n
					共${value.leaveDuration}天`
				} catch (error) {}
			}
			return item.colValue
		},
	},
}
</script>
<style scoped>
.from-title {
	margin-bottom: 20px;
	padding: 0 20px 20px 20px;
	font-size: 16px;
	color: #17233d;
	border-bottom: 1px solid #eee;
}
.info-item {
	margin-bottom: 40px;
}

.form-item {
	margin-bottom: 20px;
	font-size: 14px;
}
.form-item-label {
	text-align: right;
	float: left;
	width: 25%;
}
.form-item-content {
	margin-left: 30%;
	width: 70%;
}
</style>
